@tailwind base;
@tailwind components;
@tailwind utilities;

/* Custom styles */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

#app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
:root {
    --color-primary: #2563eb;
    --color-primary-dark: #1d4ed8;
}

.text-primary {
    color: var(--color-primary);
}

.text-primary-dark {
    color: var(--color-primary-dark);
}

.bg-primary {
    background-color: var(--color-primary);
}

.bg-primary-dark {
    background-color: var(--color-primary-dark);
}

.hover\:bg-primary-dark:hover {
    background-color: var(--color-primary-dark);
}

.focus\:ring-primary:focus {
    --tw-ring-color: var(--color-primary);
}

.border-primary {
    border-color: var(--color-primary);
}

.from-primary {
    --tw-gradient-from: var(--color-primary);
}

.to-primary-dark {
    --tw-gradient-to: var(--color-primary-dark);
}
